<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>药品供应位</title>
    <link rel="stylesheet" href="../static/css/mdui.min.css" th:href="@{/css/mdui.min.css}">
</head>
<body class="mdui-appbar-with-toolbar mdui-drawer-body-left mdui-theme-primary-teal mdui-theme-accent-pink">
<div th:replace="_widgets::header"></div>
<div th:replace="_widgets::drawer"></div>
<div class="mdui-container">
    <div class="mdui-table-fluid mdui-m-t-4">
        <table class="mdui-table">
            <thead>
            <tr>
                <th>#</th>
                <th>药品供应商</th>
                <th>详细地址</th>
                <th colspan="2"><i class="mdui-icon material-icons">&#xe5d2;</i></th>
            </tr>
            </thead>
            <tbody>
            <tr th:each="drugSupplier:${drugSuppliers}">
                <td class="no">1</td>
                <td th:text="${drugSupplier.name}">姓名</td>
                <td th:text="${drugSupplier.detail}">联系方式</td>
                <td>
                    <a href="#" th:href="@{|/drugSupplier/${drugSupplier.id}/edit|}" mdui-tooltip="{content: '修改'}">
                        <i class="mdui-icon material-icons">&#xe3c9;</i>
                    </a>
                </td>
                <td>
                    <a href="javascript:void(0)" th:onclick="|deleteItem('${drugSupplier.id}')|" mdui-tooltip="{content: '删除'}">
                        <i class="mdui-icon material-icons">&#xe872;</i>
                    </a>
                </td>
            </tr>
            </tbody>
        </table>
    </div>
    <button id="btnAdd" class="mdui-fab mdui-fab-fixed mdui-ripple mdui-color-theme-accent"
            mdui-tooltip="{content: '添加药品供应位', position: 'top'}">
        <i class="mdui-icon material-icons">add</i>
    </button>
</div>
</body>
<script src="../static/js/mdui.min.js" th:src="@{/js/mdui.min.js}"></script>
<script th:inline="javascript">
    var $$ = mdui.JQ;
    var listItem = $$('#drugSuppliers');
    listItem.addClass('mdui-list-item-active');
    listItem.parent().parent().addClass('mdui-collapse-item-open');

    var no = 1;
    $$('.no').each(function () {
        $$(this).text(no++);
    });

    $$('#btnAdd').on('click', function () {
        location.href = '/drugSupplier/add';
    });

    function deleteItem(which) {
        mdui.confirm('确定删除？删除后无法撤销', '', function () {
            doDelete(which);
        }, function () {

        }, {'confirmText': '确定', 'cancelText': '取消'});
    }

    function doDelete(which) {
        $$.ajax({
            method: 'DELETE',
            url: '/drugSupplier/' + which,
            success: function (result) {
                if (result === 'success') {
                    location.reload();
                } else {
                    mdui.alert("删除失败");
                }
            }
        });
    }
</script>
</html>